<template>
	<view>
		<view class="padding-lg text-df bg-white">
			<view class="flex-row">
				<view class="flex-column-bc" style="">
					<uni-icons type="smallcircle-filled" color="#3c9cff" size="14"></uni-icons>
					<view v-if="current>0" style="border-right: 1px solid #3c9cff; height: 100%;"></view>
				</view>
				<view class="margin-left-sm">
					<view> {{advise.createTime}}</view>
					<view class="margin-top-lg flex-row">
						<view style="width: 150rpx;">地址：</view>
						<view> {{advise.firstAddress}}</view>
					</view>
					<view class="margin-top-sm flex-row">
						<view style="width: 150rpx;">详细地址：</view>
						<view> {{advise.fullAddress}}</view>
					</view>
					<view class="margin-top-sm flex-row">
						<view style="width: 150rpx;">负责辖区：</view>
						<view> {{advise.secondAddress}}</view>
					</view>
					<view class="margin-top-sm flex-row">
						<view>意见内容：</view>
						<view style="width: 65%;height:100px;overflow-y: scroll;" @click="getDetail(advise.content)"> {{advise.content}}</view>
					</view>
					<view class="margin-tb-sm">图片描述：</view>
					<view style="display: flex; flex-wrap: wrap;">
						<image v-for="(item,index) in advise.imageList" :key="index" :src="item.url"
							style="width: 150rpx; height: 150rpx;" mode="aspectFill"
							class="margin-right-sm margin-top-sm">
						</image>
					</view>
				</view>
			</view>


			<view class="flex-row margin-top-xl" v-if="current>=1">
				<view class="flex-column-bc" style="">
					<uni-icons type="smallcircle-filled" color="#3c9cff" size="14"></uni-icons>
					<view v-if="current>1" style="border-right: 1px solid #3c9cff; height: 100%;"></view>
				</view>
				<view class="margin-left-sm">
					<view>{{resultsList.createTime}}</view>
					<view class="margin-top-lg flex-row">
						<view style="width: 150rpx;">处理人：</view>
						<view> {{resultsList.name}}{{resultsList.phone}}</view>
					</view>
					<view class="margin-top-sm flex-row">
						<view style="width: 150rpx;">处理结果：</view>
						<view style="width: 65%;height:100px;overflow-y: scroll;" @click="getDetail(resultsList.content)"> {{resultsList.content}}</view>
					</view>
					<view class="margin-top-sm flex-row">
						<view style="width: 150rpx;">处理状态：</view>
						<view> {{status}}</view>
					</view>
					<view class="margin-tb-sm">图片描述：</view>
					<view style="display: flex; flex-wrap: wrap;">
						<image v-for="(item,index) in resultsList.imageList" :key="index" :src="item.url"
							style="width: 150rpx; height: 150rpx;" mode="aspectFill"
							class="margin-right-sm margin-top-sm">
						</image>
					</view>
				</view>
			</view>

		</view>

		<view class=" margin-top-xl bg-white padding-lg">
			<view class="text-lg text-bold theme-color">驳回理由:</view>
			<u--textarea v-model="reason" placeholder="请输入驳回理由" count class="margin-top-sm"></u--textarea>
		</view>

		<view style="height: 100px;"></view>


		<view class="flex-row-bt fix-bottom">
			<button hover-class="none" class="login-btn theme-color" style="border: 1px solid #247eff;"
				@click="rejected()">驳回</button>
			<button hover-class="none" class="login-btn theme-bg-color text-white" style=""
				@click="pass()()">通过</button>
		</view>
	</view>
</template>

<script>
	import {
		getResultsByAdviseId
	} from '../../api/advise_api.js'
	import {
		passResults,
		rejectedResults,
	} from '../../api/release.js'
	export default {
		data() {
			return {
				current: 1,
				advise: {
					"id": 432,
					"phone": "18870575508",
					"location": "牛造の场黑牛烤肉局(天虹店)",
					"fullAddress": "江西省萍乡市安源区天虹广场4层4023号商铺",
					"firstAddress": "下埠镇",
					"secondAddress": "二级网格长(下埠镇，张敏)",
					"content": "他有一个",
					"createTime": "2024-04-10 09:20:49",
					"stateCode": 3,
					"state": "待审核",
					"count": 0,
					"rate": 0,
					"imageList": [{
						"id": 891,
						"url": "https://xtianchuang.com/tc/File/2024-04-10/b19a8c82-dc2b-454f-902c-a0717ca2b810.jpg",
						"aid": 432,
						"rid": null,
					}],
					"longitude": "113.874189",
					"latitude": "27.631674"

				},
				status: '',
				resultsList: {
					"id": 221,
					"aid": 432,
					"content": "1",
					"name": "刘唐武",
					"phone": "18870575508",
					"createTime": "2024-04-10 10:48:39",
					"reason": null,
					"imageList": [{
						"id": 906,
						"url": "https://xtianchuang.com/tc/File/2024-04-10/99ff3b47-298c-4b34-83d9-a380ee7f5cb7.jpg",
						"aid": null,
						"rid": 221,
					}]

				},
				//驳回理由
				reason: ''
			}
		},
		onLoad(options) {
			console.log(options.id)
			this.id = options.id
			getResultsByAdviseId(options.id).then(res => {
				console.log(JSON.stringify(res.data))
				this.advise = res.data.advise
				this.resultsList = {
					...res.data.resultsList[0]
				}
				this.status = res.data.advise.stateCode == 3 ? '待审核' : '已完成'
			})
		},
		methods: {
			getDetail(info) {
				uni.showModal({
				    content: info,//模板中提示的内容
				    confirmText:'复制内容',
				    success:(res) => {//点击复制内容的后调函数
						if(res.confirm) {
							let result
							// #ifndef H5
							//uni.setClipboardData方法就是讲内容复制到粘贴板
							uni.setClipboardData({
								data: info,//要被复制的内容
								success:() => {//复制成功的回调函数
									uni.showToast({//提示
										title:'复制成功' 
									})
								}
							});
							// #endif
							
							 // #ifdef H5 
								let textarea = document.createElement("textarea")
								textarea.value = info
								textarea.readOnly = "readOnly"
								document.body.appendChild(textarea)
								textarea.select() // 选中文本内容
								textarea.setSelectionRange(0, info.length) 
								uni.showToast({//提示
									title:'复制成功' 
								})
								result = document.execCommand("copy") 
								textarea.remove()    
							// #endif
						} else {
							console.log('取消')
						}
				    }
				});
			},
			getDate() {},
			// 审核通过
			pass() {
				uni.showModal({
					title: '提示',
					content: '确认是否通过？',
					success: res => {
						if (res.confirm) {
							let aid = this.advise.id
							passResults(aid).then(res => {
								console.log(res.code)
								if (res.code == 200) {
									uni.showToast({
										title: '通过成功',
										icon: 'success',
										duration: 2000
									})
									setTimeout(() => {
										uni.navigateBack()
									}, 500)
								} else {
									uni.showToast({
										title: res.message,
										icon: 'error',
										duration: 2000
									})
								}

							})
						}
					}
				})

			},

			// 审核驳回
			rejected() {
				if (this.reason.trim() === '') {
					uni.showModal({
						title: '请输入理由后方可驳回',
					})
					return;
				}
				uni.showModal({
					title: '提示',
					content: '确认是否误报驳回？',
					success: res => {
						if (res.confirm) {
							let id = this.resultsList.id
							let aid = this.advise.id
							let reason = this.reason
							rejectedResults(id, aid, reason).then(res => {
								if (res.code == 200) {
									uni.showToast({
										title: '驳回成功',
										icon: 'success',
										duration: 2000
									})
									setTimeout(() => {
										uni.navigateBack()
									}, 500)
								} else {
									uni.showToast({
										title: res.message,
										icon: 'error',
										duration: 2000
									})
								}
							})
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #f7f7f7;
	}

	.login-btn {
		height: 40px;
		font-size: 14px;
		line-height: 40px;
		width: 90%;
		justify-content: center;
		margin: 0 5%;
	}

	.fix-bottom {
		bottom: 3%;
		position: fixed;
		width: 100%;
	}
</style>